<template>
	<xn-form-container
		:title="formData.id ? '编辑用户' : '增加用户'"
		:width="800"
		:visible="visible"
		:destroy-on-close="true"
		:body-style="{ 'padding-top': '0px' }"
		@close="onClose"
	>
		<a-form ref="formRef" :model="formData" :rules="formRules" layout="vertical">
			<a-tabs v-model:activeKey="activeTabsKey">
				<a-tab-pane key="1" tab="在职信息" force-render>
					<a-row :gutter="16">
						<a-col :span="12">
							<a-form-item label="账号：" name="account">
								<a-input v-model:value="formData.account" placeholder="请输入账号" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="12">
							<a-form-item label="姓名：" name="name">
								<a-input v-model:value="formData.name" placeholder="请输入姓名" allow-clear />
							</a-form-item>
						</a-col>
					</a-row>
					<a-row :gutter="16">
						<a-col :span="12">
							<a-form-item label="性别：" name="gender">
								<a-radio-group v-model:value="formData.gender" :options="genderOptions" />
							</a-form-item>
						</a-col>
						<a-col :span="12">
							<a-form-item label="昵称：" name="nickname">
								<a-input v-model:value="formData.nickname" placeholder="请输入昵称" allow-clear />
							</a-form-item>
						</a-col>
					</a-row>
					<a-row :gutter="16">
						<a-col :span="8">
							<a-form-item label="选择组织：" name="orgId">
								<a-tree-select
									v-model:value="formData.orgId"
									style="width: 100%"
									:dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
									placeholder="请选择组织"
									allow-clear
									tree-default-expand-all
									:tree-data="treeData"
									:tree-default-expanded-keys="treeDefaultExpandedKeys"
									:field-names="{
										children: 'children',
										label: 'name',
										value: 'id'
									}"
									@change="selePositionData(formData.orgId, 0)"
								/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="选择职位：" name="positionId">
								<xn-page-select
									ref="xnPositionPageSelectRef"
									v-model:value="formData.positionId"
									placeholder="请选择职位"
									allow-clear
									:page-function="selectApiFunction.positionSelector"
									:echo-function="selectApiFunction.echoPosition"
								/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="选择主管：" name="directorId">
								<xn-page-select
									ref="xnUserPageSelectRef"
									v-model:value="formData.directorId"
									placeholder="请选择主管"
									allow-clear
									:page-function="selectApiFunction.userSelector"
									:echo-function="selectApiFunction.echoUser"
								/>
							</a-form-item>
						</a-col>
					</a-row>
					<a-row :gutter="16">
						<a-col :span="8">
							<a-form-item label="员工编号：" name="empNo">
								<a-input v-model:value="formData.empNo" placeholder="请输入员工编号" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="职级：" name="positionLevel">
								<a-input v-model:value="formData.positionLevel" placeholder="请输入职级" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="入职日期：" name="entryDate">
								<a-date-picker v-model:value="formData.entryDate" value-format="YYYY-MM-DD" style="width: 100%" />
							</a-form-item>
						</a-col>
					</a-row>

					<a-row :gutter="16">
						<a-col :span="16">
							<a-form-item label="合同公司：" name="belongCompany">
								<a-select
									v-model:value="formData.belongCompany"
									placeholder="请选择合同公司"
									allow-clear
									:options="belongCompanyOptions"
								/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="员工类型：" name="userType">
								<a-select
									v-model:value="formData.userType"
									placeholder="请选择员工类型"
									allow-clear
									:options="userStaffOptions"
								/>
							</a-form-item>
						</a-col>
					</a-row>

					<a-row :gutter="16">
						<a-col :span="8">
							<a-form-item label="转正日期：" name="confirmationDate">
								<a-date-picker
									v-model:value="formData.confirmationDate"
									value-format="YYYY-MM-DD"
									style="width: 100%"
								/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="工作地点：" name="workAddr">
								<a-select
									v-model:value="formData.workAddr"
									placeholder="请选择工作地点"
									allow-clear
									:options="workAddrOptions"
								/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="劳动合同开始日期：" name="laborContractSdate">
								<a-date-picker
									v-model:value="formData.laborContractSdate"
									value-format="YYYY-MM-DD"
									style="width: 100%"
								/>
							</a-form-item>
						</a-col>
					</a-row>

					<a-row :gutter="16">
						<a-col :span="8">
							<a-form-item label="劳动合同结束日期：" name="laborContractEdate">
								<a-date-picker
									v-model:value="formData.laborContractEdate"
									value-format="YYYY-MM-DD"
									style="width: 100%"
								/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="第几次签订劳动合同：" name="signLaborNum">
								<a-input v-model:value="formData.signLaborNum" placeholder="请输入第几次签订劳动合同" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="离职日期：" name="quitDate">
								<a-date-picker v-model:value="formData.quitDate" value-format="YYYY-MM-DD" style="width: 100%" />
							</a-form-item>
						</a-col>
					</a-row>

					<a-row :gutter="16">
						<a-col :span="8">
							<a-form-item label="离职原因：" name="quitReason">
								<a-select
									v-model:value="formData.quitReason"
									placeholder="请选择工作地点"
									allow-clear
									:options="quitReasonOptions"
								/>
							</a-form-item>
						</a-col>
						<a-col :span="16">
							<a-form-item label="离职备注：" name="quitRemark">
								<a-textarea
									v-model:value="formData.quitRemark"
									placeholder="请输入离职备注"
									:auto-size="{ minRows: 3, maxRows: 8 }"
									allow-clear
								/>
							</a-form-item>
						</a-col>
					</a-row>

					<a-form-item label="任职信息" name="positionJson">
						<a-button type="primary" class="childAddButton" @click="addDomains()">
							<PlusOutlined />
							增加任职
						</a-button>
						<a-row :gutter="10" class="form-row">
							<a-col :span="7" class="form-row-con"> 机构 </a-col>
							<a-col :span="7" class="form-row-con"> 职位 </a-col>
							<a-col :span="7" class="form-row-con"> 主管 </a-col>
							<a-col :span="3" class="form-row-con"> 操作 </a-col>
						</a-row>
						<div v-for="(positionInfo, index) in formData.positionJson" class="form-div">
							<a-row :gutter="10">
								<a-col :span="7">
									<a-form-item
										:name="['positionJson', index, 'orgId']"
										:rules="{ required: true, message: '请选择组织' }"
									>
										<a-tree-select
											v-model:value="positionInfo.orgId"
											style="width: 100%"
											:dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
											placeholder="请选择组织"
											allow-clear
											tree-default-expand-all
											:tree-data="treeData"
											:tree-default-expanded-keys="treeDefaultExpandedKeys"
											:field-names="{ children: 'children', label: 'name', value: 'id' }"
											@select="childOrgSelect(positionInfo, 0, index)"
										/>
									</a-form-item>
								</a-col>
								<a-col :span="7">
									<a-form-item
										:name="['positionJson', index, 'positionId']"
										:rules="{ required: true, message: '请选择职位' }"
									>
										<xn-page-select
											ref="xnChildPositionPageSelectRef"
											v-model:value="positionInfo.positionId"
											placeholder="请选择职位"
											allow-clear
											:page-function="selectApiFunction.childPositionSelector"
											:echo-function="selectApiFunction.echoPosition"
										/>
									</a-form-item>
								</a-col>
								<a-col :span="7">
									<a-form-item :name="['positionJson', index, 'directorId']">
										<xn-page-select
											ref="xnChildUserPageSelectRef"
											v-model:value="positionInfo.directorId"
											placeholder="请选择主管"
											allow-clear
											:page-function="selectApiFunction.childUserSelector"
											:echo-function="selectApiFunction.echoUser"
										/>
									</a-form-item>
								</a-col>
								<a-col :span="3" style="margin-top: 4px">
									<a-button size="small" type="primary" danger ghost @click="delDomains(index)">移除</a-button>
								</a-col>
							</a-row>
						</div>
					</a-form-item>
				</a-tab-pane>
				<a-tab-pane key="2" tab="个人信息" force-render>
					<a-row :gutter="16">
						<a-col :span="8">
							<a-form-item label="手机号：" name="phone">
								<a-input v-model:value="formData.phone" placeholder="请输入手机" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="邮箱：" name="email">
								<a-input v-model:value="formData.email" placeholder="请输入邮箱" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="出生日期：" name="birthday">
								<a-date-picker v-model:value="formData.birthday" value-format="YYYY-MM-DD" style="width: 100%" />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="农历生日：" name="lunarBirthday">
								<a-date-picker v-model:value="formData.lunarBirthday" value-format="YYYY-MM-DD" style="width: 100%" />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="籍贯：" name="nativePlace">
								<a-input v-model:value="formData.nativePlace" placeholder="请输入籍贯" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="户籍类型：" name="hjType">
								<a-select
									v-model:value="formData.hjType"
									placeholder="请选择证件类型"
									:options="hjTypeOptions"
									allow-clear
								/>
							</a-form-item>
						</a-col>
						<a-col :span="16">
							<a-form-item label="户籍地址：" name="hjAddr">
								<a-input v-model:value="formData.hjAddr" placeholder="请输入户籍地址" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="证件类型：" name="idCardType">
								<a-select
									v-model:value="formData.idCardType"
									placeholder="请选择证件类型"
									:options="idcardTypeOptions"
								/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="证件号码：" name="idCardNumber">
								<a-input v-model:value="formData.idCardNumber" placeholder="请输入证件号码" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="身份证有效期：" name="idCardValid">
								<a-input v-model:value="formData.idCardValid" placeholder="请输入政治面貌" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="民族：" name="nation">
								<a-select v-model:value="formData.nation" placeholder="请选择民族" :options="nationOptions" />
							</a-form-item>
						</a-col>
						<a-col :span="16">
							<a-form-item label="家庭住址：" name="homeAddress">
								<a-textarea
									v-model:value="formData.homeAddress"
									placeholder="请输入家庭住址"
									:auto-size="{ minRows: 2, maxRows: 5 }"
									allow-clear
								/>
							</a-form-item>
						</a-col>
						<a-col :span="16">
							<a-form-item label="通信地址：" name="mailingAddress">
								<a-textarea
									v-model:value="formData.mailingAddress"
									placeholder="请输入通信地址"
									:auto-size="{ minRows: 2, maxRows: 5 }"
									allow-clear
								/>
							</a-form-item>
						</a-col>
					</a-row>
					<a-row :gutter="16">
						<a-col :span="8">
							<a-form-item label="工资卡号：" name="salaryCard">
								<a-input v-model:value="formData.salaryCard" placeholder="请输入工资卡号" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="工资卡开户行：" name="bankName">
								<a-input v-model:value="formData.bankName" placeholder="请输入开户行" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="社保账号：" name="sbAccount">
								<a-input v-model:value="formData.sbAccount" placeholder="请输入社保账号" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="婚姻状况：" name="marriage">
								<a-select
									v-model:value="formData.marriage"
									placeholder="请选择婚姻状况"
									allow-clear
									:options="marriageOptions"
								/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="政治面貌：" name="politicalOutlook">
								<a-select
									v-model:value="formData.politicalOutlook"
									placeholder="请选择政治面貌"
									allow-clear
									:options="politicalOptions"
								/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="生育状况：" name="fertilityStatus">
								<a-select
									v-model:value="formData.fertilityStatus"
									placeholder="请选择生育状况"
									allow-clear
									:options="fertilityOptions"
								/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="紧急联系人：" name="emergencyContact">
								<a-input v-model:value="formData.emergencyContact" placeholder="紧急联系人" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="紧急联系人电话：" name="emergencyPhone">
								<a-input v-model:value="formData.emergencyPhone" placeholder="紧急联系人电话" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="紧急联系人地址：" name="emergencyAddress">
								<a-input v-model:value="formData.emergencyAddress" placeholder="紧急联系人地址" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="是否残障：" name="handicap">
								<a-radio-group v-model:value="formData.handicap" :options="handicapOptions" />
							</a-form-item>
						</a-col>
					</a-row>
				</a-tab-pane>
				<a-tab-pane key="4" tab="简历信息" force-render>
					<a-row :gutter="16">
						<a-col :span="8">
							<a-form-item label="毕业学校：" name="graduateSchool">
								<a-input v-model:value="resumeData.graduateSchool" placeholder="毕业学校" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="所学专业：" name="studyMajor">
								<a-input v-model:value="resumeData.studyMajor" placeholder="所学专业" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="最高学历：" name="maxEducation">
								<a-select
									v-model:value="resumeData.maxEducation"
									placeholder="请选择最高学历"
									:options="maxEducationOptions"
									allow-clear
								/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="最高学位：" name="maxDegree">
								<a-input v-model:value="resumeData.maxDegree" placeholder="最高学位" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="最近工作公司：" name="latelyCompany">
								<a-input v-model:value="resumeData.latelyCompany" placeholder="最近工作公司" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="最近工作部门：" name="latelyDept">
								<a-input v-model:value="resumeData.latelyDept" placeholder="最近工作部门" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="最近工作职位：" name="latelyPos">
								<a-input v-model:value="resumeData.latelyPos" placeholder="最近工作职位" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="日语等级：" name="jaLevel">
								<a-select
									v-model:value="resumeData.jaLevel"
									placeholder="请选择日语等级"
									:options="jaLevelOptions"
									allow-clear
								/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="JAVA技术年限：" name="javaLimit">
								<a-select
									v-model:value="resumeData.javaLimit"
									placeholder="请选择JAVA技术年限"
									:options="commonLifeOptions"
									allow-clear
								/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="PHP技术年限：" name="phpLimit">
								<a-select
									v-model:value="resumeData.phpLimit"
									placeholder="请选择PHP技术年限"
									:options="commonLifeOptions"
									allow-clear
								/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="Python技术年限：" name="pythonLimit">
								<a-select
									v-model:value="resumeData.pythonLimit"
									placeholder="请选择Python技术年限"
									:options="commonLifeOptions"
									allow-clear
								/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label=".Net技术年限：" name="netLimit">
								<a-select
									v-model:value="resumeData.netLimit"
									placeholder="请选择.Net技术年限"
									:options="commonLifeOptions"
									allow-clear
								/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="数据库能力：" name="dataLimit">
								<a-select
									v-model:value="resumeData.dataLimit"
									placeholder="请选择数据库能力"
									:options="dataLimitOptions"
									allow-clear
								/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="小程序经验：" name="appletLimit">
								<a-select
									v-model:value="resumeData.appletLimit"
									placeholder="请选择小程序经验"
									:options="commonLifeOptions"
									allow-clear
								/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="微信开发经验：" name="wechatLimit">
								<a-select
									v-model:value="resumeData.wechatLimit"
									placeholder="请选择微信开发经验"
									:options="commonLifeOptions"
									allow-clear
								/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="手机开发经验：" name="phoneLimit">
								<a-select
									v-model:value="resumeData.phoneLimit"
									placeholder="请选择手机开发经验"
									:options="commonLifeOptions"
									allow-clear
								/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="前端开发年限：" name="frontLimit">
								<a-select
									v-model:value="resumeData.frontLimit"
									placeholder="请选择前端开发年限"
									:options="commonLifeOptions"
									allow-clear
								/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="前端技术内容：" name="forntContent">
								<a-input v-model:value="resumeData.forntContent" placeholder="前端技术内容" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="测试经验：" name="testExp">
								<a-select
									v-model:value="resumeData.testExp"
									placeholder="请选择测试经验"
									:options="commonLifeOptions"
									allow-clear
								/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="测试工具掌握：" name="testTool">
								<a-input v-model:value="resumeData.testTool" placeholder="测试工具掌握" allow-clear />
							</a-form-item>
						</a-col>
					</a-row>
				</a-tab-pane>
				<a-tab-pane key="5" tab="材料附件" force-render>
					<a-row :gutter="16">
						<a-col :span="12">
							<a-form-item label="身份证照片：" name="idCard">
								<preUpload
									@modelValue="getIdcard"
									:limit="3"
									:fileSize="10"
									:fileIds="attachData.idCard"
									:isShow="false"
								/>
							</a-form-item>
						</a-col>
						<a-col :span="12">
							<a-form-item label="劳动合同：" name="laborContract">
								<preUpload
									@modelValue="getLabor"
									:limit="3"
									:fileSize="10"
									:fileIds="attachData.laborContract"
									:isShow="false"
								/>
							</a-form-item>
						</a-col>
						<a-col :span="12">
							<a-form-item label="入职体检单：" name="testForm">
								<preUpload
									@modelValue="getTestForm"
									:limit="3"
									:fileSize="10"
									:fileIds="attachData.testForm"
									:isShow="false"
								/>
							</a-form-item>
						</a-col>
						<a-col :span="12">
							<a-form-item label="入职简历：" name="resume">
								<preUpload
									@modelValue="getResume"
									:limit="3"
									:fileSize="10"
									:fileIds="attachData.resume"
									:isShow="false"
								/>
							</a-form-item>
						</a-col>
						<a-col :span="12">
							<a-form-item label="上家公司离职证明：" name="oldCompany">
								<preUpload
									@modelValue="getOldCompany"
									:limit="3"
									:fileSize="10"
									:fileIds="attachData.oldCompany"
									:isShow="false"
								/>
							</a-form-item>
						</a-col>
						<a-col :span="12">
							<a-form-item label="职业资格证书：" name="posCert">
								<preUpload
									@modelValue="getPosCert"
									:limit="3"
									:fileSize="10"
									:fileIds="attachData.idCard"
									:isShow="false"
								/>
							</a-form-item>
						</a-col>
						<a-col :span="12">
							<a-form-item label="学历证明：" name="degreeCert">
								<preUpload
									@modelValue="getDegreeCert"
									:limit="3"
									:fileSize="10"
									:fileIds="attachData.degreeCert"
									:isShow="false"
								/>
							</a-form-item>
						</a-col>
						<a-col :span="12">
							<a-form-item label="个人证件照：" name="personalPhoto">
								<preUpload
									@modelValue="getPersonalPhoto"
									:limit="3"
									:fileSize="10"
									:fileIds="attachData.personalPhoto"
									:isShow="false"
								/>
							</a-form-item>
						</a-col>
						<a-col :span="12">
							<a-form-item label="入职登记表：" name="rzRegister">
								<preUpload
									@modelValue="getRzRegister"
									:limit="3"
									:fileSize="10"
									:fileIds="attachData.rzRegister"
									:isShow="false"
								/>
							</a-form-item>
						</a-col>
						<a-col :span="12">
							<a-form-item label="其它：" name="otherAttch">
								<preUpload
									@modelValue="getOtherAttch"
									:limit="3"
									:fileSize="10"
									:fileIds="attachData.otherAttch"
									:isShow="false"
								/>
							</a-form-item>
						</a-col>
					</a-row>
				</a-tab-pane>
			</a-tabs>
		</a-form>
		<template #footer>
			<a-button style="margin-right: 8px" @click="onClose">关闭</a-button>
			<a-button type="primary" :loading="formLoading" @click="onSubmit">保存</a-button>
		</template>
	</xn-form-container>
</template>

<script setup>
	import userApi from '@/api/sys/userApi'
	import userCenterApi from '@/api/sys/userCenterApi'
	import { required } from '@/utils/formRules'
	import tool from '@/utils/tool'
	import preUpload from '@/components/preUpload/index.vue'
	// 默认是关闭状态
	const visible = ref(false)
	const formRef = ref()
	const activeTabsKey = ref('1')
	const emit = defineEmits({ successful: null })
	const formLoading = ref(false)
	const treeData = ref([])
	const treeDefaultExpandedKeys = ref([])
	// 分页select组件dom定义
	const xnPositionPageSelectRef = ref()
	const xnUserPageSelectRef = ref()
	const xnChildPositionPageSelectRef = ref()
	const xnChildUserPageSelectRef = ref()
	// 表单数据
	const formData = ref({})
	const resumeData = ref({})
	const attachData = ref({})
	const handicapOptions = ref([
		{
			label: '否',
			value: 2
		},
		{
			label: '是',
			value: 1
		}
	])

	// 打开抽屉
	const onOpen = (record, orgId) => {
		visible.value = true
		resumeData.value = {}
		attachData.value = {}
		formData.value = {
			gender: '男',
			positionJson: []
		}
		if (orgId) {
			formData.value.orgId = orgId
			// 通过机构再查询职位、主管
			nextTick(() => {
				selePositionData(orgId)
			})
		}
		if (record) {
			convertFormData(record)
		}
		nextTick(() => {
			// 机构选择器数据
			userApi.userOrgTreeSelector().then((res) => {
				if (res !== null) {
					treeData.value = res
					// 默认展开2级
					treeData.value.forEach((item) => {
						// 因为0的顶级
						if (item.parentId === '0') {
							treeDefaultExpandedKeys.value.push(item.id)
							// 取到下级ID
							if (item.children) {
								item.children.forEach((items) => {
									treeDefaultExpandedKeys.value.push(items.id)
								})
							}
						}
					})
				}
			})
		})
	}
	// 关闭抽屉
	const onClose = () => {
		treeData.value = []
		treeDefaultExpandedKeys.value = []
		visible.value = false
	}
	// 回显数据
	const convertFormData = (record) => {
		const param = {
			id: record.id
		}
		// 查询详情
		userApi.userDetail(param).then((data) => {
			if (data.positionJson) {
				// 替换表单中的格式与后端查到的
				data.positionJson = JSON.parse(data.positionJson)
			}
			formData.value = Object.assign(formData.value, data)
			resumeData.value = formData.value.resume
			attachData.value = formData.value.attach
			// 这里再写一次是因为上面需要先加载增行，下面再进行循环赋值
			if (data.positionJson) {
				// 遍历进行补充
				data.positionJson.map((item, index) => {
					childOrgSelect(item, 1, index)
					return item
				})
			}
			selePositionData(formData.value.orgId)
		})
	}

	// 默认要校验的
	const formRules = {
		account: [required('请输入账号')],
		name: [required('请输入姓名')],
		sex: [required('请选择性别')],
		orgId: [required('请选择组织')],
		positionId: [required('请选择职位')]
	}
	// 机构选择后查询对应的职位
	const selePositionData = (orgId, type) => {
		if (orgId) {
			const xnPositionPageSelectParam = {
				orgId: orgId
			}
			xnPositionPageSelectRef.value.onPage(xnPositionPageSelectParam)
			xnUserPageSelectRef.value.onPage()
			// 此类型代表选择的时候重置后面的职位
			if (type === 0) {
				formData.value.positionId = undefined
				formData.value.directorId = undefined
			}
		} else {
			formData.value.positionId = undefined
			formData.value.directorId = undefined
		}
	}
	// 传递选择组件需要的API
	const selectApiFunction = {
		positionSelector: (param) => {
			return userApi.userPositionSelector(param).then((data) => {
				return Promise.resolve(data)
			})
		},
		userSelector: (param) => {
			return userApi.userSelector(param).then((data) => {
				return Promise.resolve(data)
			})
		},
		childPositionSelector: (param) => {
			return userApi.userPositionSelector(param).then((data) => {
				return Promise.resolve(data)
			})
		},
		childUserSelector: (param) => {
			return userApi.userSelector(param).then((data) => {
				return Promise.resolve(data)
			})
		},
		// 通过id回显数据接口
		echoPosition: (param) => {
			return userCenterApi.userCenterGetPositionListByIdList(param).then((data) => {
				return Promise.resolve(data)
			})
		},
		echoUser: (param) => {
			return userCenterApi.userCenterGetUserListByIdList(param).then((data) => {
				return Promise.resolve(data)
			})
		}
	}
	// 附属职位信息增行
	const addDomains = () => {
		if (formData.value.positionJson === null) {
			formData.value.positionJson = []
		}
		formData.value.positionJson.push({
			orgId: undefined,
			positionId: undefined,
			directorId: undefined
		})
	}
	// 删减行
	const delDomains = (index) => {
		formData.value.positionJson.splice(index, 1)
	}

	// 子表行内选择机构
	const childOrgSelect = (data, type, index) => {
		// 说明正在切换机构，我们就将他的后面的设置空
		if (type === 0) {
			formData.value.positionJson.filter((item, serial) => {
				if (item.orgId === data.orgId && serial === index) {
					item.positionId = undefined
					item.directorId = undefined
				}
			})
		}
		const param = {
			orgId: data.orgId
		}
		nextTick(() => {
			xnChildPositionPageSelectRef.value[index].onPage(param)
			xnChildUserPageSelectRef.value[index].onPage(param)
		})
	}
	// 验证并提交数据
	const onSubmit = () => {
		formRef.value.validate().then(() => {
			// 因为不切断，我下面转换数据格式，影响上面表单会报错
			let formDatas = JSON.parse(JSON.stringify(formData.value))
			if (formDatas.positionJson && formDatas.positionJson.length > 0) {
				formDatas.positionJson = JSON.stringify(formDatas.positionJson)
			} else {
				delete formDatas.positionJson
			}
			formDatas.resume = resumeData.value
			formDatas.attach = attachData.value
			formLoading.value = true
			userApi
				.submitForm(formDatas, formDatas.id)
				.then(() => {
					onClose()
					emit('successful')
				})
				.finally(() => {
					formLoading.value = false
				})
		})
	}
	// 身份证照片
	const getIdcard = (ids) => {
		console.log(ids)
		attachData.value.idCard = ids
	}
	// 劳动合同
	const getLabor = (ids) => {
		attachData.value.laborContract = ids
	}
	// 入职体检单
	const getTestForm = (ids) => {
		attachData.value.testForm = ids
	}
	// 入职简历
	const getResume = (ids) => {
		attachData.value.testForm = ids
	}
	// 上家公司离职证明
	const getOldCompany = (ids) => {
		attachData.value.oldCompany = ids
	}
	// 职业资格证书
	const getPosCert = (ids) => {
		attachData.value.posCert = ids
	}
	// 学历证明
	const getDegreeCert = (ids) => {
		attachData.value.degreeCert = ids
	}
	// 个人证件照
	const getPersonalPhoto = (ids) => {
		attachData.value.personalPhoto = ids
	}
	// 入职登记表
	const getRzRegister = (ids) => {
		attachData.value.rzRegister = ids
	}
	// 其它
	const getOtherAttch = (ids) => {
		attachData.value.otherAttch = ids
	}
	// 性别
	const genderOptions = tool.dictList('GENDER')
	// 民族
	const nationOptions = tool.dictList('NATION')
	// 身份证件
	const idcardTypeOptions = tool.dictList('IDCARD_TYPE')
	// 文化程度
	const cultureLevelOptions = tool.dictList('CULTURE_LEVEL')
	// 婚姻状况
	const marriageOptions = tool.dictList('MARRIAGE')
	// 政治面貌
	const politicalOptions = tool.dictList('POLITICAL')
	// 生育状况
	const fertilityOptions = tool.dictList('FERTILITY')
	// 户籍类型
	const hjTypeOptions = tool.dictList('HJTYPE')
	// 合同公司
	const belongCompanyOptions = tool.dictList('BELONG_COMPANY')
	// 员工类型
	const userStaffOptions = tool.dictList('COMPANY_STAFF_TYPE')
	// 工作地点
	const workAddrOptions = tool.dictList('WORK_ADDRESS')
	// 离职原因
	const quitReasonOptions = tool.dictList('QUIT_REASON')
	// 年限
	const commonLifeOptions = tool.dictList('COMMON_LIFE')
	// 日语等级
	const jaLevelOptions = ref([
		{
			label: 'N1',
			value: '1'
		},
		{
			label: 'N2',
			value: '2'
		},
		{
			label: 'N3',
			value: '3'
		},
		{
			label: 'N4',
			value: '4'
		},
		{
			label: 'N5',
			value: '5'
		}
	])
	// 技术熟练程度
	const dataLimitOptions = ref([
		{
			label: '了解',
			value: '00'
		},
		{
			label: '熟悉',
			value: '01'
		},
		{
			label: '精通',
			value: '02'
		}
	])
	// 最高学历
	const maxEducationOptions = tool.dictList('MAX_EDUCATION')
	// 调用这个函数将子组件的一些数据和方法暴露出去
	defineExpose({
		onOpen
	})
</script>

<style scoped type="less">
	.childAddButton {
		margin-bottom: 10px;
	}
	.form-row {
		background-color: var(--item-hover-bg);
		margin-left: 0px !important;
	}
	.form-row-con {
		padding-bottom: 5px;
		padding-top: 5px;
		padding-left: 15px;
	}
	.form-div {
		padding-top: 10px;
	}
</style>
